/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

import React, { useRef, useEffect, useState, useCallback } from 'react'
import styles from './style.less'
import { Spin } from 'antd'
import PageHeaderLayout from "@/layouts/PageHeaderLayout";
import qs from 'qs'

export default function News() {
  const iframeRef = useRef('')
  const [loading, setLoading] = useState(true)
  const [blocked, setBlocked] = useState(false)
  const [index, setIndex] = useState(0)
  
  useEffect(() => {
    //降域解决iframe跨域问题
    location.hostname.match("kuaidihelp.com") && (document.domain = 'kuaidihelp.com')
    setIndex(qs.parse(window.location.search.substring(1)).index || 0)
  }, [window.location.search])
  
  const onLoad = useCallback(
    () => {
      try {
        if( iframeRef.current.contentWindow.document.body.scrollHeight == 0){
          setBlocked(true)
        }else{
          setBlocked(false)
        }
      } catch (error) {
        setBlocked(true)
        iframeRef.current.height = 0
        console.warn(error)
      }
      setLoading(false)
    },
    [window.location.search]
  )

  return (
    <PageHeaderLayout title="新闻中心">
      <div className={styles.main}>
        <Spin spinning={loading}>
          {blocked && <h1>当前页面暂无内容或者已被屏蔽，请关闭相关广告拦截插件再进行查看！</h1>}
          <iframe
            ref={iframeRef}
            className={styles.newsDetail}
            onLoad={onLoad}
            src={`//m.kuaidihelp.com/adv_news/newsDetail?platform=citysite_news&position=1&index=${index}`}
            // src={`//${location.hostname}/advertisement/details.html?platform=citysite_news&position=1&index=${index}`}
            scrolling="no"
          />
        </Spin>
      </div>
    </PageHeaderLayout>
  )
}
